.td-patient-reservation-detail {
    padding-top: 40px;
    .mint-header {
        background: #1cd3ce;
    }
    .me-header {
        width: 100%;
        height: computer(200px);
        background-image: url(../images/doctor/me-header-bg.png);
        background-position: bottom center;
        background-repeat: no-repeat;
        background-size: cover;
        position: relative;
        .me-header-bg {
            border-radius: 50%;
            width: computer(100px);
            height: computer(100px);
            background: #fff;
            position: absolute;
            top: 30%;
            left: 50%;
            transform: translate(-50%, -30%);
            img {
                border-radius: 50%;
                width: computer(90px);
                height: computer(90px);
                margin-left: 5px;
                margin-top: 5px;
            }
        }
        .me-header-user-name {
            color: #fff;
            position: absolute;
            top: 80%;
            left: 50%;
            transform: translate(-50%, -80%);
            &:last-child {
                top: 92%;
            }
        }
    }
    .mint-cell-wrapper {
        color: #666666;
    }
    .mint-popup-box {
        width: 100%;
        height: 50%;
    }
    .mint-popup-box {
        .list-box {
            height: 200px;
            overflow: auto;
            padding-bottom: 10px;
        }
        .list-appointment {
            padding: 0 10px;
            h2 {
                font-weight: normal;
                text-align: center;
            }
            table {
                width: 100%;
                tr {
                    td {
                        height: 40px;
                        line-height: 40px;
                    }
                }
            }
        }
    }
    .reservation-date {
        margin-top: 15px;
        height: 401px;
    }
    .date-select {
        border-top: 1px solid #ddd;
        padding: 0 5px;
        margin-top: 10px;
        font-size: 14px;
        color: #333;
        h2 {
            font-weight: normal;
            text-align: center;
            padding: 10px 0;
            span {
                font-size: 12px;
                margin-left: 10px;
            }
        }
        &>div {
            display: flex;
            align-items: center;
            height: 40px;
            line-height: 40px;
            p {
                width: 33.33%;
                text-align: center;
                &:nth-child(2) {
                    span {
                        i {
                            margin-right: 3px;
                        }
                        &.tip-appointment {
                            i {
                                color: #ff869a;
                            }
                        }
                        &.tip-expiration {
                            i {
                                color: #ae5da1;
                            }
                        }
                        &.tip-no-setting {
                            i {
                                color: #dadada;
                            }
                        }
                    }
                }
                &:nth-child(3) {
                    width: 20%;
                }
            }
        }
    }
}